var home = {
    // 轮播
    changebanner: function () {
        var mySwiper = new Swiper('.swiper-container', {
            autoplay: 3000,
            pagination: '.dots',
            simulateTouch: false,
            loop: true,
            paginationClickable: true,
            autoplayDisableOnInteraction: false,
            prevButton: '.swiper-button-prev',
            nextButton: '.swiper-button-next',
        })
    },
    // tab切换
    fn_title_tab: function () {
        $(document).on('click', '.title-tab li,.map-tab li,.me-tab-text li', function () {
            var _index = $(this).index();
            $(this).addClass('active').siblings('li').removeClass('active')
        })
    },
    // 快捷下拉
    fn_quick:function(){
        var timer=null;
        $(document).on({
            mouseenter:function(){
                var hover=$(this).parents('.me-quick').find('.quick-hover')
                var item=$(this).parents('.me-quick').find('.quick-item')
                var siblings=$(this).parent().siblings()
                if($(this).closest('.quick-top').length>0){
                    siblings.addClass('mask')
                    hover.removeClass('quick-hover-bottom')
                }else{
                    siblings.removeClass('mask')
                    hover.addClass('quick-hover-bottom')
                }
                item.removeClass('active')
                $(this).addClass('active')
                clearTimeout(timer)
                hover.show();
            },
            mouseleave:function(){
                var hover=$(this).parents('.me-quick').find('.quick-hover')
                var that=this;
                timer=setTimeout(function(){
                    $(that).removeClass('active')
                    hover.hide();
                },100)
            }
        },'.me-quick .quick-item')
        $(document).on({
            mouseenter:function(){
                clearTimeout(timer)
            },
            mouseleave:function(){
                var item=$(this).parents('.me-quick').find('.quick-item')
                item.removeClass('active')
                $(this).hide();
            }

        },'.me-quick .quick-hover')
    },

    // 统计图
    fn_trend_chart: function () {
        var myChart = echarts.init(document.getElementById('trend_chart'));
        var base = 0
        var oneDay = 24 * 3600 * 1000;
        var date = [];

        var data = data1 = [Math.random() * 300];
        // data.push(Math.floor(Math.random()*100+1))
        for (var i = 1; i < 60; i++) {
            var now = new Date(base += oneDay);
            date.push([now.getMonth() + 1, now.getDate()].join('.'));
            var save = Math.round((Math.random() - 0.5) * 20 + data[i - 1])
            var save1 = Math.round((Math.random() - 0.5) + data[i - 1])
            if (save > 0) {
                data.push(save);
                data1.push(save1);
            }
        }


        var option = {
            tooltip: {
                trigger: 'axis',
                position: function (pt) {
                    return [pt[0], '10%'];
                }
            },
            legend: {
                icon: 'circle',
                itemWidth: 5,
                // padding: [5, 10],
                itemGap: 11,
                textStyle: {
                    padding: [0, 7],
                },
                top: 0,
                right: 0,
                data: ['普卷', '高线']
            },
            grid: {
                left: 0,
                right: 0,
                bottom: 0,
                top: 50,
                containLabel: true,
            },

            xAxis: {
                type: 'category',
                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false,
                    // interval:function(a,b){
                    //     console.log(a,b);
                        
                    // }, 
                },
              
                axisLabel: {
                    color: '#999',
                    // inside:true,
                    margin: 10,
                    interval:15, 
                    // padding: [3, 4, 30,0],
                    // verticalAlign:'middle',

                },
                data: date
            },
            yAxis: {
                type: 'value',
                axisLine: {
                    show: false
                },
                axisTick: {
                    show: false,
                },
                splitLine: {
                    show: false,
                },
                axisLabel: {
                    color: '#999',
                    // inside:true,
                    // margin: 0,
                    // padding: [3, 4, 30,0],
                    // verticalAlign:'middle',

                },
            },

            series: [{
                name: '普卷',
                type: 'line',
                smooth: true,
                color: '#D0111C',
                symbol: 'none', //数据点形状
                itemStyle: {
                    normal: {
                        lineStyle: {
                            color: '#F88282',
                            width: 2
                        }
                    }
                },
                areaStyle: {
                    normal: {
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                            offset: 0,
                            color: '#FEF9F9'
                        }, {
                            offset: 1,
                            color: '#FFB7B7'
                        }])
                    }
                },
                data: data
            }, {
                name: '高线',
                type: 'line',
                smooth: true,
                color: '#688de5',
                symbol: 'none', //数据点形状
                itemStyle: {
                    normal: {
                        lineStyle: {
                            color: '#688de5',
                            width: 2
                        }
                    }
                },
                areaStyle: {
                    normal: {
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                            offset: 0,
                            color: '#688de5'
                        }, {
                            offset: 1,
                            color: '#fff'
                        }])
                    }
                },
                data: data1
            }]

        }
        myChart.setOption(option);
    },
    // 地图
    fn_trend_map: function () {
        var myChart = echarts.init(document.getElementById('trend_map'));
        var data = [{
            name: "海门",
            value: [121.15, 31.89, 9]
        }, {
            name: "鄂尔多斯",
            value: [109.781327, 39.608266, 9],
        }, {
            name: "招远",
            value: [120.38, 37.35, 9],
        }]
        var option = {
            tooltip: {
                trigger: 'item',
                formatter: function (params) {
                    return params.name + ' : ' + params.value[2];
                }
            },
            geo: {
                map: 'china',
                label: {
                    emphasis: {
                        show: false
                    }
                },
                left: 0,
                right: 0,
                bottom: 0,
                top: 0,
                itemStyle: {
                    normal: {
                        areaColor: '#FCC3C3',
                        borderColor: '#fff'
                    },
                    emphasis: {
                        // show:false,
                        areaColor: '#FCC3C3'
                    }
                }
            },
            series: [{
                name: '热卷',
                type: 'scatter',
                coordinateSystem: 'geo',
                data: data,
                symbolSize: 10,
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: true,
                        color: '#E16767',
                    }
                },

                itemStyle: {
                    color: '#F47D83',
                    emphasis: {
                        borderColor: '#fff',
                        borderWidth: 1
                    }
                }
            }]
        }
        myChart.setOption(option);
    },
    // 更多
    fn_more: function () {
        $('.map-middle .more').mouseenter(function () {
            $(this).parent().addClass('showing');
            $(this).parent().find('.more-list').show();
        })
        $(document).on('mouseleave', '.showing', function () {
            $(this).removeClass('showing');
            $(this).find('.more-list').hide();
        })
    },
    // 滚动
    fn_slick_map: function () {
        $('.map-slick').slick({
            autoplay: false,
            draggable: false,
            arrows: true,
            dots: false
        });
    },
    fn_slick_steel: function () {
        $('.steel-slick').slick({
            autoplay: false,
            draggable: false,
            arrows: true,
            slidesToShow: 5,
            slidesToScroll: 5
        });
    },
    fn_slick_shop: function () {
        $('.shop-middle-slick').slick({
            autoplay: false,
            draggable: false,
            arrows: true,
        });
        $('.shop-right-slick').slick({
            vertical: true,
            autoplay: true,
            draggable: false,
            arrows: true,
        });
    },
    // 全产业链图片变化
    fn_img:function(){
        $(document).on('mouseenter','.product-description li',function(){
            $(this).stop().animate({
                width:380,
            },300)
            .siblings('li').stop().animate({
                width:200,
            },300)

            $(this).find('.des-mask').stop(true,true).fadeIn(300).siblings('li').find('.des-mask').stop(true,true).fadeOut(300)
        })
        $(document).on('mouseleave','.product-description li',function(){
            var item=$(".product-description li")
            item.stop().animate({
                width:236,
            },300)
            item.find('.des-mask').fadeOut(300)
        })
    },

    init: function () {
        this.changebanner();
        this.fn_title_tab();
        this.fn_quick();
        this.fn_trend_chart();
        this.fn_trend_map();
        this.fn_more();
        this.fn_slick_map();
        this.fn_slick_steel();
        this.fn_slick_shop();
        this.fn_img();
    },
}

$(function () {
    home.init();
})